<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>前端模块化 | 悄悄的卷，然后卷死所有人</title>
    <meta name="description" content="这是一个奇怪的地方">
    <link rel="stylesheet" href="/blobview/assets/style.019f39fc.css">
    <link rel="modulepreload" href="/blobview/assets/Home.d05cdc04.js">
    <link rel="modulepreload" href="/blobview/assets/app.a4363fd4.js">
    <link rel="modulepreload" href="/blobview/assets/fe_secondary_interviews_modular.md.38434f4f.lean.js">
    <link rel="modulepreload" href="/blobview/assets/app.a4363fd4.js">
    <meta name="twitter:title" content="前端模块化 | 悄悄的卷，然后卷死所有人">
    <meta property="og:title" content="前端模块化 | 悄悄的卷，然后卷死所有人">
  </head>
  <body>
    <div id="app"><!--[--><div class="theme"><header class="nav-bar" data-v-675d8756><div class="sidebar-button" data-v-675d8756><svg class="icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z" class></path></svg></div><a class="nav-bar-title" href="/blobview/" aria-label="悄悄的卷，然后卷死所有人, back to home" data-v-675d8756 data-v-4a583abe><!----> 悄悄的卷，然后卷死所有人</a><div class="flex-grow" data-v-675d8756></div><div class="nav" data-v-675d8756><nav class="nav-links" data-v-675d8756 data-v-eab3edfe><!--[--><div class="item" data-v-eab3edfe><div class="nav-link" data-v-eab3edfe data-v-b8818f8c><a class="item" href="/blobview/" data-v-b8818f8c>Home <!----></a></div></div><div class="item" data-v-eab3edfe><div class="nav-dropdown-link" data-v-eab3edfe data-v-56bf3a3f><button class="button" data-v-56bf3a3f><span class="button-text" data-v-56bf3a3f>前端君</span><span class="right button-arrow" data-v-56bf3a3f></span></button><ul class="dialog" data-v-56bf3a3f><!--[--><li class="dialog-item" data-v-56bf3a3f><div class="nav-dropdown-link-item" data-v-56bf3a3f data-v-bbc27490><a class="item" href="/blobview/fe/secondary/interviews/network" data-v-bbc27490><span class="arrow" data-v-bbc27490></span><span class="text" data-v-bbc27490>面试八股文</span><span class="icon" data-v-bbc27490><!----></span></a></div></li><li class="dialog-item" data-v-56bf3a3f><div class="nav-dropdown-link-item" data-v-56bf3a3f data-v-bbc27490><a class="item" href="/blobview/fe/algorithm" data-v-bbc27490><span class="arrow" data-v-bbc27490></span><span class="text" data-v-bbc27490>算法大卷</span><span class="icon" data-v-bbc27490><!----></span></a></div></li><li class="dialog-item" data-v-56bf3a3f><div class="nav-dropdown-link-item" data-v-56bf3a3f data-v-bbc27490><a class="item" href="/blobview/fe/errormd/chrome插件开发指南" data-v-bbc27490><span class="arrow" data-v-bbc27490></span><span class="text" data-v-bbc27490>坑你太美</span><span class="icon" data-v-bbc27490><!----></span></a></div></li><!--]--></ul></div></div><div class="item" data-v-eab3edfe><div class="nav-dropdown-link" data-v-eab3edfe data-v-56bf3a3f><button class="button" data-v-56bf3a3f><span class="button-text" data-v-56bf3a3f>稀奇君</span><span class="right button-arrow" data-v-56bf3a3f></span></button><ul class="dialog" data-v-56bf3a3f><!--[--><li class="dialog-item" data-v-56bf3a3f><div class="nav-dropdown-link-item" data-v-56bf3a3f data-v-bbc27490><a class="item" href="/blobview/fe/secondary/interviews/network" data-v-bbc27490><span class="arrow" data-v-bbc27490></span><span class="text" data-v-bbc27490>web3</span><span class="icon" data-v-bbc27490><!----></span></a></div></li><!--]--></ul></div></div><div class="item" data-v-eab3edfe><div class="nav-link" data-v-eab3edfe data-v-b8818f8c><a class="item" href="/blobview/b" data-v-b8818f8c>杂谈君 <!----></a></div></div><!--]--><!----><!----></nav></div><!--[--><!--]--></header><aside class="sidebar" data-v-83e92a68><nav class="nav-links nav" data-v-83e92a68 data-v-eab3edfe><!--[--><div class="item" data-v-eab3edfe><div class="nav-link" data-v-eab3edfe data-v-b8818f8c><a class="item" href="/blobview/" data-v-b8818f8c>Home <!----></a></div></div><div class="item" data-v-eab3edfe><div class="nav-dropdown-link" data-v-eab3edfe data-v-56bf3a3f><button class="button" data-v-56bf3a3f><span class="button-text" data-v-56bf3a3f>前端君</span><span class="right button-arrow" data-v-56bf3a3f></span></button><ul class="dialog" data-v-56bf3a3f><!--[--><li class="dialog-item" data-v-56bf3a3f><div class="nav-dropdown-link-item" data-v-56bf3a3f data-v-bbc27490><a class="item" href="/blobview/fe/secondary/interviews/network" data-v-bbc27490><span class="arrow" data-v-bbc27490></span><span class="text" data-v-bbc27490>面试八股文</span><span class="icon" data-v-bbc27490><!----></span></a></div></li><li class="dialog-item" data-v-56bf3a3f><div class="nav-dropdown-link-item" data-v-56bf3a3f data-v-bbc27490><a class="item" href="/blobview/fe/algorithm" data-v-bbc27490><span class="arrow" data-v-bbc27490></span><span class="text" data-v-bbc27490>算法大卷</span><span class="icon" data-v-bbc27490><!----></span></a></div></li><li class="dialog-item" data-v-56bf3a3f><div class="nav-dropdown-link-item" data-v-56bf3a3f data-v-bbc27490><a class="item" href="/blobview/fe/errormd/chrome插件开发指南" data-v-bbc27490><span class="arrow" data-v-bbc27490></span><span class="text" data-v-bbc27490>坑你太美</span><span class="icon" data-v-bbc27490><!----></span></a></div></li><!--]--></ul></div></div><div class="item" data-v-eab3edfe><div class="nav-dropdown-link" data-v-eab3edfe data-v-56bf3a3f><button class="button" data-v-56bf3a3f><span class="button-text" data-v-56bf3a3f>稀奇君</span><span class="right button-arrow" data-v-56bf3a3f></span></button><ul class="dialog" data-v-56bf3a3f><!--[--><li class="dialog-item" data-v-56bf3a3f><div class="nav-dropdown-link-item" data-v-56bf3a3f data-v-bbc27490><a class="item" href="/blobview/fe/secondary/interviews/network" data-v-bbc27490><span class="arrow" data-v-bbc27490></span><span class="text" data-v-bbc27490>web3</span><span class="icon" data-v-bbc27490><!----></span></a></div></li><!--]--></ul></div></div><div class="item" data-v-eab3edfe><div class="nav-link" data-v-eab3edfe data-v-b8818f8c><a class="item" href="/blobview/b" data-v-b8818f8c>杂谈君 <!----></a></div></div><!--]--><!----><!----></nav><!--[--><!--]--><ul class="sidebar-links" data-v-83e92a68><!--[--><li class="sidebar-link"><a class="sidebar-link-item" href="#模块化的演进过程">模块化的演进过程</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#模块化规范的出现">模块化规范的出现</a><ul class="sidebar-links"><li class="sidebar-link"><a class="sidebar-link-item" href="#目前实现模块化的规范主要有：">目前实现模块化的规范主要有：</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#模块化的好处：">模块化的好处：</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#commonjs规范">CommonJS规范</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#amd规范">AMD规范</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#cmd规范">CMD规范</a><!----></li></ul></li><li class="sidebar-link"><a class="sidebar-link-item" href="#模块化标准规范">模块化标准规范</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#esmodules特性">ESmodules特性</a><ul class="sidebar-links"><li class="sidebar-link"><a class="sidebar-link-item" href="#esmodules导入导出的注意事项">ESmodules导入导出的注意事项</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#es-modules导入用法">ES Modules导入用法</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#es-modules-in-browser">ES modules in Browser</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#cdn形式兼容方案">cdn形式兼容方案</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#es-module-in-node-js-支持情况">ES Module in Node.js 支持情况</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#es-modules-in-node-js-与-commonjs交互">ES modules in Node.js 与 Commonjs交互</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#es-mdules-in-node-js-与-commonjs的差异">ES Mdules in node.js 与  Commonjs的差异</a><!----></li><li class="sidebar-link"><a class="sidebar-link-item" href="#es-module-node-js-babel-兼容方案">ES Module node.js -Babel 兼容方案</a><!----></li></ul></li><!--]--></ul><!--[--><!--]--></aside><div class="sidebar-mask"></div><main class="page" data-v-7eddb2c4><div class="container" data-v-7eddb2c4><!--[--><!--]--><div style="position:relative;" class="content" data-v-7eddb2c4><div><h1 id="前端模块化" tabindex="-1">前端模块化 <a class="header-anchor" href="#前端模块化" aria-hidden="true">#</a></h1><h2 id="模块化的演进过程" tabindex="-1">模块化的演进过程 <a class="header-anchor" href="#模块化的演进过程" aria-hidden="true">#</a></h2><p>早起模块化完全依靠约定，项目一旦庞大将会维护成本极高</p><p>1.基于文件的划分模块的问题</p><ul><li>污染全局作用域</li><li>命名冲突问题</li><li>无法管理模块依赖关系</li></ul><p>2.命名空间方式</p><p>3.立即执行函数的形式提供私有空间</p><h2 id="模块化规范的出现" tabindex="-1">模块化规范的出现 <a class="header-anchor" href="#模块化规范的出现" aria-hidden="true">#</a></h2><h3 id="目前实现模块化的规范主要有：" tabindex="-1">目前实现模块化的规范主要有： <a class="header-anchor" href="#目前实现模块化的规范主要有：" aria-hidden="true">#</a></h3><ul><li>CommonJS</li><li>CMD</li><li>AMD</li><li>ES6模块(ESmodules)</li></ul><h3 id="模块化的好处：" tabindex="-1">模块化的好处： <a class="header-anchor" href="#模块化的好处：" aria-hidden="true">#</a></h3><ol><li><p>可维护性。 因为模块是独立的，一个设计良好的模块会让外面的代码对自己的依赖越少越好，这样自己就可以独立去更新和改进。</p></li><li><p>命名空间。 在 JavaScript 里面，如果一个变量在最顶级的函数之外声明，它就直接变成全局可用。因此，常常不小心出现命名冲突的情况。使用模块化开发来封装变量，可以避免污染全局环境。</p></li><li><p>重用代码。 我们有时候会喜欢从之前写过的项目中拷贝代码到新的项目，这没有问题，但是更好的方法是，通过模块引用的方式，来避免重复的代码库。我们可以在更新了模块之后，让引用了该模块的所有项目都同步更新，还能指定版本号，避免 API 变更带来的麻烦。</p></li></ol><h3 id="commonjs规范" tabindex="-1">CommonJS规范 <a class="header-anchor" href="#commonjs规范" aria-hidden="true">#</a></h3><p>commonjs是以同步模式加载模块</p><ul><li>一个文件就是一个模块</li><li>每个模块都有单独的作用域</li><li>通过module.exports导出成员</li><li>通过require函数载入模块</li></ul><h3 id="amd规范" tabindex="-1">AMD规范 <a class="header-anchor" href="#amd规范" aria-hidden="true">#</a></h3><p>异步模式加载模块，一种前端模块化的临时方案</p><ul><li>AMD使用相对复杂</li><li>模块JS文件请求频繁</li></ul><h3 id="cmd规范" tabindex="-1">CMD规范 <a class="header-anchor" href="#cmd规范" aria-hidden="true">#</a></h3><p>CMD 即Common Module Definition通用模块定义，CMD规范是国内发展出来的，就像AMD有个requireJS，CMD有个浏览器的实现SeaJS，SeaJS要解决的问题和requireJS一样，只不过在模块定义方式和模块加载（可以说运行、解析）时机上有所不同</p><h2 id="模块化标准规范" tabindex="-1">模块化标准规范 <a class="header-anchor" href="#模块化标准规范" aria-hidden="true">#</a></h2><p>模块的化的最佳实践 ESmodules 和 CommonJS</p><p>ESmodule是前端最规范的模块化标准,但需要配合构建工具使用（ES6才推出的新标准）</p><h2 id="esmodules特性" tabindex="-1">ESmodules特性 <a class="header-anchor" href="#esmodules特性" aria-hidden="true">#</a></h2><ul><li>自动采用严格模式、忽略 &#39;use strict&#39;</li><li>每个ESM模块都是单独的私有作用域</li><li>ESM是通过CORS去请求外部JS模块</li><li>ESM的SCRIPT标签会延迟执行脚本</li></ul><h3 id="esmodules导入导出的注意事项" tabindex="-1">ESmodules导入导出的注意事项 <a class="header-anchor" href="#esmodules导入导出的注意事项" aria-hidden="true">#</a></h3><ul><li>导出的成员并不是字面量对象，只是写法类似</li><li>导入的语法也类似解构语法，但是并不是解构的意思，只是类似。</li><li>ESMODULES导出的过程中，并不是导出成员，而是把成员的值给你，你并不能修改esmodule内的导出值</li><li>导入的成员是只读的成员</li></ul><h3 id="es-modules导入用法" tabindex="-1">ES Modules导入用法 <a class="header-anchor" href="#es-modules导入用法" aria-hidden="true">#</a></h3><p>import用法</p><div class="language-"><pre><code>// import { name } from &#39;./module&#39;
// import { name } from &#39;./module.js&#39;
// console.log(name)

// import { lowercase } from &#39;./utils&#39;
// import { lowercase } from &#39;./utils/index.js&#39;
// console.log(lowercase(&#39;HHH&#39;))

// import { name } from &#39;module.js&#39;
// import { name } from &#39;./module.js&#39;
// import { name } from &#39;/04-import/module.js&#39;
// import { name } from &#39;http://localhost:3000/04-import/module.js&#39;
// console.log(name)

// --------------

// import {} from &#39;./module.js&#39;
// import &#39;./module.js&#39;

// ---------------

// import * as mod from &#39;./module.js&#39;
// mod为导出全部 并定位 mod
// console.log(mod)

// ---------------

// var modulePath = &#39;./module.js&#39;
// import { name } from modulePath
// console.log(name)

// if (true) {
//   import { name } from &#39;./module.js&#39;
// }

// import(&#39;./module.js&#39;).then(function (module) {
//   console.log(module)
// })

// ----------------

// import { name, age, default as title } from &#39;./module.js&#39;
//abc为 export default默认导出
// {name age }为 export
import abc, { name, age } from &#39;./module.js&#39;
console.log(name, age, abc)

</code></pre></div><h3 id="es-modules-in-browser" tabindex="-1">ES modules in Browser <a class="header-anchor" href="#es-modules-in-browser" aria-hidden="true">#</a></h3><p>Polyfill兼容方案 浏览器运行环境给我们带来兼容问题</p><h3 id="cdn形式兼容方案" tabindex="-1">cdn形式兼容方案 <a class="header-anchor" href="#cdn形式兼容方案" aria-hidden="true">#</a></h3><div class="language-"><pre><code>借助 &lt;script nomodule&gt;&lt;/scirpt&gt;来判断不识别es-module的判断
</code></pre></div><p><a href="https://unpkg.com/browse/browser-es-module-loader@0.4.1/dist/" target="_blank" rel="noopener noreferrer">https://unpkg.com/browse/browser-es-module-loader@0.4.1/dist/</a> 生产环境不建议使用，运算比较大</p><h3 id="es-module-in-node-js-支持情况" tabindex="-1">ES Module in Node.js 支持情况 <a class="header-anchor" href="#es-module-in-node-js-支持情况" aria-hidden="true">#</a></h3><div class="language-javascript"><pre><code><span class="token comment">// 第一，将文件的扩展名由 .js 改为 .mjs；</span>
<span class="token comment">// 第二，启动时需要额外添加 `--experimental-modules` 参数；</span>

<span class="token keyword">import</span> <span class="token punctuation">{</span> foo<span class="token punctuation">,</span> bar <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;./module.mjs&#39;</span>

console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>foo<span class="token punctuation">,</span> bar<span class="token punctuation">)</span>

<span class="token comment">// 此时我们也可以通过 esm 加载内置模块了</span>
<span class="token keyword">import</span> fs <span class="token keyword">from</span> <span class="token string">&#39;fs&#39;</span>
fs<span class="token punctuation">.</span><span class="token function">writeFileSync</span><span class="token punctuation">(</span><span class="token string">&#39;./foo.txt&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;es module working&#39;</span><span class="token punctuation">)</span>

<span class="token comment">// 也可以直接提取模块内的成员，内置模块兼容了 ESM 的提取成员方式</span>
<span class="token keyword">import</span> <span class="token punctuation">{</span> writeFileSync <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;fs&#39;</span>
<span class="token function">writeFileSync</span><span class="token punctuation">(</span><span class="token string">&#39;./bar.txt&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;es module working&#39;</span><span class="token punctuation">)</span>

<span class="token comment">// 对于第三方的 NPM 模块也可以通过 esm 加载</span>
<span class="token keyword">import</span> _ <span class="token keyword">from</span> <span class="token string">&#39;lodash&#39;</span>
_<span class="token punctuation">.</span><span class="token function">camelCase</span><span class="token punctuation">(</span><span class="token string">&#39;ES Module&#39;</span><span class="token punctuation">)</span>

<span class="token comment">// 不支持，因为第三方模块都是导出默认成员</span>
<span class="token comment">// import { camelCase } from &#39;lodash&#39;</span>
<span class="token comment">// console.log(camelCase(&#39;ES Module&#39;))</span>

</code></pre></div><h3 id="es-modules-in-node-js-与-commonjs交互" tabindex="-1">ES modules in Node.js 与 Commonjs交互 <a class="header-anchor" href="#es-modules-in-node-js-与-commonjs交互" aria-hidden="true">#</a></h3><ul><li>ES modules 中可以导入Commonjs模块</li><li>CommonJS中不能导入 ES Modules模块</li><li>CommonJS始终只会导出一个默认成员</li><li>注意import不是解构导出对象</li></ul><h3 id="es-mdules-in-node-js-与-commonjs的差异" tabindex="-1">ES Mdules in node.js 与 Commonjs的差异 <a class="header-anchor" href="#es-mdules-in-node-js-与-commonjs的差异" aria-hidden="true">#</a></h3><p>它们有两个重大差异：</p><ol><li>CommonJS 模块输出的是一个值的拷贝，ES6 模块输出的是值的引用。</li><li>CommonJS 模块是运行时加载，ES6 模块是编译时输出接口。</li></ol><p>第二个差异是因为 CommonJS 加载的是一个对象（即module.exports属性），该对象只有在脚本运行完才会生成。而 ES6 模块不是对象，它的对外接口只是一种静态定义，在代码静态解析阶段就会生成。</p><p>下面重点解释第一个差异，我们还是举上面那个CommonJS模块的加载机制例子:</p><div class="language-javascript"><pre><code><span class="token comment">// lib.js</span>
<span class="token keyword">export</span> <span class="token keyword">let</span> counter <span class="token operator">=</span> <span class="token number">3</span><span class="token punctuation">;</span>
<span class="token keyword">export</span> <span class="token keyword">function</span> <span class="token function">incCounter</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
  counter<span class="token operator">++</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token comment">// main.js</span>
<span class="token keyword">import</span> <span class="token punctuation">{</span> counter<span class="token punctuation">,</span> incCounter <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;./lib&#39;</span><span class="token punctuation">;</span>
console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>counter<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 3</span>
<span class="token function">incCounter</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>counter<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 4</span>

</code></pre></div><p>ES6 模块的运行机制与 CommonJS 不一样。ES6 模块是动态引用，并且不会缓存值，模块里面的变量绑定其所在的模块。</p><h3 id="es-module-node-js-babel-兼容方案" tabindex="-1">ES Module node.js -Babel 兼容方案 <a class="header-anchor" href="#es-module-node-js-babel-兼容方案" aria-hidden="true">#</a></h3><p>对于早期的 Node.js 版本，可以使用 Babel 实现 ES Module 的兼容</p><div class="language-javascript"><pre><code> <span class="token comment">// .babelrc</span>
<span class="token punctuation">{</span>
  <span class="token string">&quot;plugins&quot;</span><span class="token operator">:</span> <span class="token punctuation">[</span>
    <span class="token string">&quot;@babel/plugin-transform-modules-commonjs&quot;</span>
  <span class="token punctuation">]</span>
<span class="token punctuation">}</span>

</code></pre></div><div class="language-javascript"><pre><code><span class="token comment">//package.json</span>
<span class="token punctuation">{</span>
  <span class="token string">&quot;devDependencies&quot;</span><span class="token operator">:</span> <span class="token punctuation">{</span>
    <span class="token string">&quot;@babel/core&quot;</span><span class="token operator">:</span> <span class="token string">&quot;^7.6.0&quot;</span><span class="token punctuation">,</span>
    <span class="token string">&quot;@babel/node&quot;</span><span class="token operator">:</span> <span class="token string">&quot;^7.6.1&quot;</span><span class="token punctuation">,</span>
    <span class="token string">&quot;@babel/plugin-transform-modules-commonjs&quot;</span><span class="token operator">:</span> <span class="token string">&quot;^7.6.0&quot;</span>
  <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre></div></div></div><footer class="page-footer" data-v-7eddb2c4 data-v-fb8d84c6><div class="edit" data-v-fb8d84c6><div class="edit-link" data-v-fb8d84c6 data-v-1ed99556><!----></div></div><div class="updated" data-v-fb8d84c6><!----></div></footer><!----><!--[--><!--]--></div></main></div><!----><!--]--></div>
    <script>__VP_HASH_MAP__ = JSON.parse("{\"fe_algorithm.md\":\"e1054222\",\"fe_errormd_chrome插件开发指南.md\":\"8310a77a\",\"fe_errormd_mysql密码遗忘.md\":\"37b8860e\",\"fe_secondary_javascript_descriptors.md\":\"cd9a7474\",\"fe_secondary_javascript_javascript.md\":\"42853649\",\"fe_secondary_javascript_jicheng.md\":\"1cd0c4dc\",\"fe_secondary_javascript_jscopy.md\":\"66795111\",\"fe_secondary_javascript_js数据类型.md\":\"c6bc851f\",\"fe_secondary_javascript_let const var 的区别.md\":\"685e3545\",\"fe_secondary_javascript_weakmap.md\":\"2a0ba820\",\"fe_secondary_javascript_作用域.md\":\"220cfcf9\",\"fe_secondary_javascript_变量提升.md\":\"b63f20ee\",\"fe_secondary_javascript_闭包.md\":\"5404cbcf\",\"fe_secondary_python_基础知识.md\":\"ae39dc27\",\"fe_secondary_vite_vite杂烩记录.md\":\"aa7cf9a4\",\"fe_secondary_webpack_loader与plugin的不同.md\":\"e2712a7c\",\"fe_secondary_interviews_jstype.md\":\"b3e700ba\",\"fe_secondary_interviews_mianshi.md\":\"218f21c3\",\"fe_secondary_interviews_modular.md\":\"38434f4f\",\"fe_secondary_interviews_network.md\":\"d5842ea6\",\"fe_suanfa_tree树结构.md\":\"d41c852f\",\"fe_suanfa_二分查找.md\":\"28f745d1\",\"fe_suanfa_二叉树.md\":\"836f7969\",\"fe_suanfa_二叉树后序遍历.md\":\"af43c381\",\"fe_suanfa_二叉树展开链表.md\":\"cc410293\",\"fe_suanfa_二叉树最小深度.md\":\"d272316f\",\"fe_suanfa_二叉树的所有路径.md\":\"70f2feac\",\"fe_suanfa_二叉树的最大深度.md\":\"ab1fe25c\",\"fe_suanfa_冒泡排序.md\":\"b91ecca4\",\"fe_suanfa_前中后序遍历.md\":\"997426ab\",\"fe_suanfa_前缀和.md\":\"6ec90ae8\",\"fe_suanfa_区域和检索数组不可变.md\":\"6e447cdb\",\"fe_suanfa_反转数组.md\":\"c28c7d5f\",\"fe_suanfa_将有序数组转换为二叉搜索树.md\":\"6a79c21d\",\"fe_suanfa_差分.md\":\"101d6b54\",\"fe_suanfa_快速排序.md\":\"575fe1af\",\"fe_suanfa_插入排序.md\":\"078511c5\",\"fe_suanfa_滑动窗口.md\":\"08f684ff\",\"fe_suanfa_翻转二叉树.md\":\"1a866015\",\"fe_suanfa_选择排序.md\":\"a25eac11\",\"fe_suanfa_链表反转.md\":\"a642cc7a\",\"fe_web3_ethers_01-hellovitalik.md\":\"162c31f8\",\"fe_web3_ethers_02-合约交互.md\":\"08f30902\",\"fe_web3_ethers_03-发送eth.md\":\"fbf8825d\",\"index.md\":\"64947f2b\"}")</script>
    <script type="module" async src="/blobview/assets/app.a4363fd4.js"></script>
    
  </body>
</html>